<template>
  <div class="ele-body">
    <ContainerBillsearchForm @search="reload" />
    <ContainerBill ref="containerBillTableComp" @billIdSelect="billIdSelect_m" />
    <a-tabs v-model:activeKey="activeKey">
      <a-tab-pane key="1" tab="费用明细">
        <ContainerBillFee ref="containerBillFeeComp" :processListDataS="processListData" 
        @containBillSelect="containBillSelect"></ContainerBillFee>
      </a-tab-pane>
      <a-tab-pane key="2" tab="运单流程" force-render>
        <ContainerBillProcess ref="containerBillProcessComp" @processList="processListM"></ContainerBillProcess>
      </a-tab-pane>
    </a-tabs>
    <div class="bottom"></div>
  </div>
</template>

<script setup>
import { ref, reactive, watch, provide } from 'vue';

import ContainerBillsearchForm from './components/containerBillsearchForm.vue';
import ContainerBill from './components/containerBill.vue';
import ContainerBillFee from './components/containerBillFee.vue';
import ContainerBillProcess from './components/containerBill-process.vue';

//拖车列表选中一条记录, 刷新下面的列表
// containerBill = 
// {
//   'billId': 0,
//   'invoice': {
//     'company': containerBillCurrent.value.customer,
//     'driver': containerBillCurrent.value.driver,
      // 'carTeam': containerBillCurrent.value.carTeam,
//   }
// }
let billIdSelect_m = (data) => {
  containerBillFeeComp.value.containerBillFeeReload(data)
  containerBillProcessComp.value.containerBillProcessReload(data.billId)
}

let containerBillTableComp = ref(null)
let containerBillFeeComp = ref(null)
let containerBillProcessComp = ref(null)
let reload = (where) => {
  containerBillTableComp.value.reload(where)
  containerBillFeeComp.value.containerBillFeeReload({
    'billId': 0,
    'invoice': {
      'company': 1,
      'driver': 1,
    } 
  })
  containerBillProcessComp.value.containerBillProcessReload(0)
}
let processListData = ref(null)
let processListM = (data) => {
  containerBillTableComp.value.permissions(data)
  containerBillFeeComp.value.permissions(data)
  // processListData.value=data
}
let activeKey = ref('1')


//应收,应付 费用确认按钮 
//刷新流程列表, 相当于重新点击拖车列表
let containBillSelect = (data) => {
  containerBillTableComp.value.sendBillSelect(data)
}

</script>

<script>
export default {
  name: 'DemoTest'
};
</script>

<style lang="less" scoped>
.bottom {
  margin-bottom: 600px;
}
</style>